<template lang="html">
  <div class="editor">
    <textarea id="tincyme" ></textarea>
  </div>
</template>

<script>
import tinymce from 'tinymce/tinymce'
import 'tinymce/themes/silver/theme'
 import Editor from '@tinymce/tinymce-vue'
  import 'tinymce/plugins/image'
// import 'tinymce/plugins/link'
// import 'tinymce/plugins/code'
// import 'tinymce/plugins/table'
// import 'tinymce/plugins/lists'
// import 'tinymce/plugins/contextmenu'
// import 'tinymce/plugins/wordcount'
// import 'tinymce/plugins/colorpicker'
// import 'tinymce/plugins/textcolor'
import 'tinymce/skins/ui/oxide/skin.css'
export default {
  name: 'tinymce',
  data () {
    return {
      tinymceHtml: '请输入内容',
      init: {
        language_url: '/static/tinymce/zh_CN.js',
        language: 'zh_CN',
        skin_url: '/static/tinymce/skins/lightgray',
        height: 300,
        plugins: 'link lists image code table colorpicker textcolor wordcount contextmenu',
        toolbar:
          'bold italic underline strikethrough | fontsizeselect | forecolor backcolor | alignleft aligncenter alignright alignjustify | bullist numlist | outdent indent blockquote | undo redo | link unlink image code | removeformat',
        branding: false
      }
    }
  },
  mounted () {
    this.seteditor()
  },
  methods:{
  seteditor(){
    tinymce.init({
      selector: '#tincyme',//传入id
      language_url: '/static/tinymce/zh_CN.js',
      language:'zh_CN', //设置汉化 还要记得将汉化包放在文件里面哦
      images_upload_url:'后端给的上传图片接口',
       plugins: 'print preview searchreplace autolink directionality visualblocks', //这些都是按需导入
       toolbar: 'code undo redo restoredraft ', //想要什么就加什么就好
       height: 650, //编辑器高度
       min_height: 400,//按照自己的需求设置
       
    })
    }
  },
  beforeDestroy () {
  window.tinymce.remove('#tincyme') //一定要销毁 否则每次都需要刷新页面才能初始化
     }
}
</script>